<template>
    <div>
        <button @click="handleClick" :disabled="isLoading">
            {{!isLoading? 'click' :'submit'}}
        </button>
        <p>{{error}}</p>
    </div>
</template>

<script>
    export default {
        props: {
            click:Function
        },
        data() {
            return {
                isLoading: false,
                error: '',
                count:0
            }
        },
        methods: {
           async handleClick() {
               this.isLoading = true;
               const err = await this.click();
               this.error = err;
               this.isLoading = false
            }
        }
    }
</script>

<style lang="less" scoped>
button {
    margin: 0 auto;
}
</style>